/**
 * v-clickOutside
 * 点击元素外部事件
 * 接收参数：function类型，点击外面时返回true,点击内部时返回false
 */
 import type { Directive, DirectiveBinding } from 'vue'
 interface ElType extends HTMLElement {
   __handleClick__: any
 }
 const directive: Directive = {
   mounted(el: ElType, binding: DirectiveBinding) {
     if (typeof binding.value !== 'function') {
       throw 'callback must be a function'
     }
     el.__handleClick__ = function(e:any) {
       if (el.contains(e.target)) {
         binding.value(false)
       } else {
         binding.value(true)
       }
       
     }
     document.addEventListener('click', el.__handleClick__)
   },
   beforeUnmount(el: ElType) {
     document.removeEventListener('click', el.__handleClick__)
   }
 }
 
 export default directive